<template>
  <div class="Weee">
    <div>
      <img src="../assets/image/Weee/carousel.png" alt="">
    </div>
    <div class="container">
      <indicator-arrow :title="'公司简介'"></indicator-arrow>
      <div class="introduce">
        <div class="text">
          <div>
          杭州逐一科技有限公司成立于2017年11月，坐落于美丽的富春江畔，毗邻320国道，是一家专门从事智慧城市之智慧停车建设的科技创新型公司。响应2015年8月3日国家发改委公布的《关于加强城市停车设施建设的指导意见》，公司始终专注城市智慧停车、停车场智能改造、物联网产品的设计开发，系统集成与运营服务。
          </div>
          <div>
            逐一科技以智慧停车为入口，深耕城市各类停车资源，将静态交通大数据与智慧城市服务深度结合，为城市管理者、停车经营管理方、车主和合作伙伴提供城市级静态交通综合解决方案、大数据应用和停车资产经营管理服务，致力于解决城市”停车难，乱停车”问题。
          </div>
          <div>
            公司拥有完善的自主研发体系。其中，研发团队是公司的主力军，占比高达50%，目前在全视频智能识别、物联网、大数据、云计算及人工智能等方面已经拥有了深厚的技术积累 。拥有强大技术力量的逐一科技能够依托城市交通顶层设计，开发以视频检测识别、物联网、云计算、移动互联网、大数据等技术为基础的城市智慧停车管理平台以及手机移动端应用，最终实现停车收费、取证、监管等功能于一体。
          </div>
          <div>
            由于对智慧城市领域的不断深入与对智能技术的不断钻研，逐一科技凭借移动计算、智能识别、数据融合等核心技术，在智慧停车项目的研发、建设和运营以及交通智能化、物流智能化等方向上不断发展。同时，秉承着勇于创新和务实的精神，公司在停车场智能改造、停车智能诱导、城市信息化应用等智慧领域也处于行业领先地位。
          </div>
          <div>
            逐一科技本着“让智能技术服务美好生活”的使命，带领强大的技术研发团队，以专业化技术研发和成熟的项目运作模式，正朝着智慧停车互联网+，智慧城市创新2.0建设迈进！
          </div>
        </div>
        <img src="http://www.zhuyitech.com/static/img/WechatIMG4.4072231.jpeg" alt="">
      </div>
      <indicator-arrow :title="'企业文化'"></indicator-arrow>
      <div class="culture">
        <div>
          <img src="../assets/image/Weee/icon_sm.png" alt="">
          <h3>使命</h3>
          <p>让智能技术服务美好生活<br/>&nbsp;</p>
        </div>
        <div>
          <img src="../assets/image/Weee/icon_yj.png" alt="">
          <h3>愿景</h3>
          <p>成为全球领先的智慧城市<br/>构建服务商</p>
        </div>
        <div>
          <img src="../assets/image/Weee/icon_jzg.png" alt="">
          <h3>价值观</h3>
          <p>开放、服务、高效、创新、<br/>以人为尊、科技为本</p>
        </div>
      </div>
      <div class="joinUs">
        <indicator-arrow :title="'加入我们'"></indicator-arrow>
        <div class="recruit">
          <div>
            <div><p>Java高级开发工程师</p><p>研发部</p></div>
            <div>
              <span>任职要求</span>
              <p>计算机软件及相关专业，本科及以上学历，五年以上实际Java项目开发工作经验</p>
              <p>JAVA基础扎实，理解io、多线程、集合等基础框架，对JVM原理有一定的了解。熟悉J2EE技术、熟悉各种开源的框架，如：spring、hibernate等</p>
              <p>分析并解决软件开发过程中的问题</p>
              <p>熟悉MySQL相关数据库，有数据库设计、分库分表、主从分离、SQL编写及优化的经验</p>
              <p>熟练应用Dubbo、Zookeepr、mycat、mybatis、redis等框架</p>
              <p>从事过分布式架构开发，熟悉缓存、消息等机制，对于高并发有实际开发经验，具有独立开发架构的经验</p>
            </div>
          </div>
          <div>
            <div><p>Java高级开发工程师</p><p>研发部</p></div>
            <div>
              <span>任职要求</span>
              <p>计算机软件及相关专业，本科及以上学历，五年以上实际Java项目开发工作经验</p>
              <p>JAVA基础扎实，理解io、多线程、集合等基础框架，对JVM原理有一定的了解。熟悉J2EE技术、熟悉各种开源的框架，如：spring、hibernate等</p>
              <p>分析并解决软件开发过程中的问题</p>
              <p>熟悉MySQL相关数据库，有数据库设计、分库分表、主从分离、SQL编写及优化的经验</p>
              <p>熟练应用Dubbo、Zookeepr、mycat、mybatis、redis等框架</p>
              <p>从事过分布式架构开发，熟悉缓存、消息等机制，对于高并发有实际开发经验，具有独立开发架构的经验</p>
            </div>
          </div>
        </div>
      </div>
      <indicator-arrow :title="'联系我们'"></indicator-arrow>
      <div class="callMeBaby">
        <div>
          <div class="tell">
            <div>杭州逐一科技有限公司</div>
            <div>Hangzhou Zoeeasy Technology Co.,Ltd</div>
            <div>服务热线:4008-872-866</div>
            <div>地址：浙江省杭州市富阳区春秋北路591号二楼</div>
            <div>邮箱: service@zoeeasy.com</div>
            <div>网址：www.zoeeasy.com</div>
          </div>
          <div class="map">
            <div class="mapPosition">
              <div id="iCenter"></div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import indicatorArrow from "../components/indicatorArrow.vue"

export default {
  data() {
    return {
      arriveCoor:[119.991529,30.142439],//坐标点
            arrive:"",//位置信息
    }
  },
  components: {indicatorArrow},
  methods: {
    mapDraw(arriveCoor){
      let map = new AMap.Map('iCenter', {   //map-location是嵌地图div的id
          resizeEnable: true, //是否监控地图容器尺寸变化
          zoom:16, //初始化地图层级
          center: arriveCoor //初始化地图中心点
      });
      let marker = new AMap.Marker({
        icon: "//vdata.amap.com/icons/b18/1/2.png",  //图片ip
        imageSize: "30px",
        position: arriveCoor,
        offset: new AMap.Pixel(-13, -30),
        // 设置是否可以拖拽
        draggable: false,
        cursor: 'move',
        // 设置拖拽效果
        raiseOnDrag: true
      });
      map.add(marker)
    },
  },
  created() {

  },
  mounted() {
    this.mapDraw(this.arriveCoor)
  }
}
</script>

<style lang="scss" scoped>
  .Weee {
    margin-top: 80px;
    > div > img {
      width: 100%;
    }
    .introduce {
      text-align: center;
      margin-top: 27px;
      > .text {
        display: inline-block;
        text-align: left;
        width: 495px;
        font-size: 14px;
        font-weight: 400;
        color: #222222;
        line-height: 18px;
        text-indent: 2em;
        margin-right: 72px;
        > div {
          margin-bottom: 25px;
        }
      }
      > img {
        display: inline-block;
        width: 640px;
        height: 501px;
        vertical-align: top;
      }
    }

    .culture {
      text-align: center;
      margin-top: 58px;
      margin-bottom: 69px;
      > div {
        display: inline-block;
        width: 400px;
        height: 400px;
        padding-top: 65px;
        box-sizing: border-box;
        &:hover {
          box-shadow: 0px 0px 20px 0px rgba(170, 170, 170, 0.3);
        }

        > h3 {
          font-size: 26px;
          font-weight: bold;
          line-height: 20px;
          margin: 25px 0px
        }

        > p {
          color: #373636;
          line-height: 28px;
          font-size: 20px;
        }
      }
    }

    .joinUs {
      background-color: #F7F7F7;
      text-align: center;
      padding-bottom: 85px;
      > .recruit {
        margin-top: 88px;

        > div {
          width: 580px;
          text-align: left;
          display: inline-block;
          margin-left: 30px;
          margin-right: 15px;

          > div:nth-child(1) {
            background-color: #3296FA;
            height: 60px;
            text-align: center;
            line-height: 60px;
            > p {
              display: inline-block;
              color: #FFFFFF;
            }
            > p:nth-child(1){
              font-size: 24px;
              margin-right: 28px;
            }
            > p:nth-child(2){
              font-size: 18px;
            }
          }

          > div:nth-child(2) {
            padding: 25px 35px;
            background-color: #fff;
            line-height: 21px;
            > span {
              font-size: 16px;
            }

            > p {
              font-size: 14px;
            }
          }
        }
      }
    }

    .callMeBaby {
      margin-top: 48px;
      text-align: center;
      margin-bottom: 106px;

      > div {

        .tell {
          width: 412px;
          background-color: #1743AE;
          color: #FFFFFF;
          display: inline-block;
          height: 460px;
          text-align: left;
          padding: 111px 35px;
          line-height: 16px;

          > div {
            font-size: 16px;
          }
          > div:nth-child(1) {
            font-size: 26px;
            margin-bottom: 25px;
          }
          > div:nth-child(2) {
            font-size: 14px;
            width: 263px;
            height: 25px;
            border-bottom: 1px solid #DEDEDE;
            box-sizing: border-box;
            margin-bottom: 25px;
          }
          > div:nth-child(3) {
            font-size: 24px;
            margin-bottom: 65px;
            color: #FFD925;
          }
          > div:nth-child(4) {
            margin-bottom: 20px;
          }
          > div:nth-child(5) {
            margin-bottom: 20px;
          }
        }

        .map {
          display: inline-block;
          width: 788px;
          // background-color: red;
          vertical-align: top;
          height: 460px;
        }
      }
      
    }
  }
  .mapPosition{
    width: 100%;
    height: 100%;
    .map-title{
      .title{
        height: 60px;
        line-height: 60px;
        font-size: 28px;
      }
      .positionInfo{
        height: 50px;
        span{
          display: inline-block;
          height: 30px;
          line-height: 30px;
          font-size: 21px;
        }
      }
    }
    #iCenter{
      width: 100%;
      height: 460px;
      margin: 0 auto;
    }
  }
</style>